<!doctype html>
<html lang="cn" xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link href="/res/inspinia/css/bootstrap.min.css" rel="stylesheet">
    <link href="/res/inspinia/font-awesome/css/font-awesome.css" rel="stylesheet">
    <!-- bootstrap-table-->
    <link href="/res/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <!-- bootstrap-datepicker -->
    <link href="/res/inspinia/css/plugins/datapicker/datepicker3.css" rel="stylesheet">
    <!--jsTree-->
    <link href="/res/inspinia/css/plugins/jsTree/style.min.css" rel="stylesheet">

    <link href="/res/inspinia/css/animate.css" rel="stylesheet">
    <link href="/res/inspinia/css/style.css" rel="stylesheet">

    <title>预算汇总</title>
</head>
<body class="mini-navbar fixed-sidebar">
<div id="wrapper">

    <div id="page-wrapper" class="gray-bg">
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-12">
                    <div class="ibox ">
                        <div class="ibox-title">
                            <h5>预算列表</h5>
                        </div>
                        <div class="ibox-content">
                            <div class="row">
                                <div class="col">
                                    <div id="moneySum_table_toolbar" style="margin: 0;">
                                        <form role="form" id="moneySum_form" class="form-inline">
                                            <div class="form-group m-r-xs">
                                                <label for="moneySum_ap" class="sr-only">会计期间</label>
                                                <select class="form-control" id="moneySum_ap">
                                                </select>
                                            </div>
                                            <div class="form-group m-r-xs">
                                                <label for="moneySum_moneyTypeCode" class="sr-only">经费类型</label>
                                                <!--/*@thymesVar id="moneyTypes" type="MoneyTypeEnums[]"*/-->
                                                <select class="form-control" id="moneySum_moneyTypeCode">
                                                    <option th:each="moneyType : ${moneyTypes}" th:value="${moneyType.code}">[[${moneyType.name}]]</option>
                                                </select>
                                            </div>
                                            <div class="form-group m-r-xs">
                                                <label for="moneySum_projectName" class="sr-only">预算项目</label>
                                                <input type="text" class="form-control" id="moneySum_projectName"
                                                       placeholder="预算项目">
                                            </div>
                                            <div class="form-group m-r-xs">
                                                <label for="moneySum_cateName" class="sr-only">经济分类</label>
                                                <input type="text" class="form-control" id="moneySum_cateName"
                                                       placeholder="经济分类">
                                            </div>
                                            <div>
                                                <button class="btn btn-primary" type="button"
                                                        onclick="moneySumObj.refreshTable()">查询
                                                </button>
                                                <button class="btn btn-white" type="button"
                                                        onclick="moneySumObj.resetTable()">重置
                                                </button>
                                                <button class="btn btn-warning" type="button"
                                                        onclick="moneySumObj.expertTable()">
                                                    <i class="fa fa-download"></i> 导出
                                                </button>
                                            </div>
                                        </form>
                                    </div>
                                    <table id="moneySum_table" class="table table-striped"></table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--弹窗：冻结-->
<div class="modal inmodal fade" id="moneySum_freezsModal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title">经费冻结</h4>
                <small class="font-bold"></small>
            </div>
            <div class="modal-body">
                <table id="moneySum_freezs_table" class="table table-striped"></table>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
<!-- Mainly scripts -->
<script src="/res/inspinia/js/jquery-3.1.1.min.js"></script>
<script src="/res/inspinia/js/popper.min.js"></script>
<script src="/res/inspinia/js/bootstrap.js"></script>
<script src="/res/inspinia/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="/res/inspinia/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<!-- Custom and plugin javascript -->
<script src="/res/inspinia/js/inspinia.js"></script>
<script src="/res/inspinia/js/plugins/pace/pace.min.js"></script>
<!-- bootstrap-table -->
<script src="/res/jquery/tableExport.jquery.plugin/tableExport.js"></script>
<script src="/res/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/res/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="/res/bootstrap-table/extensions/export/bootstrap-table-export.js"></script>
<!--jsTree-->
<script src="/res/inspinia/js/plugins/jsTree/jstree.min.js"></script>
<script type="text/javascript">
    $().ready(function () {
        let initYear = `[[${initYear}]]`;
        let lastYear = new Date().getFullYear() - 1;
        for (let i = lastYear; i >= initYear; i--) {
            $('#moneySum_ap').append($(`<option value="${i}">${i}年</option>`));
        }
        // 切换会计期间
        $('#moneySum_ap').on('change', function (e) {
            moneySumObj.refreshTable();
        })
        moneySumObj.initTable();
        moneySumObj.initFreezsTable();
        $('#moneySum_freezsModal').on('show.bs.modal', function (event) {
            $('#moneySum_freezs_table').bootstrapTable('refresh',{
                url: `/money/his/moneyinfofreezs/freezsList`,
                query: {
                    ap: moneySumObj.selMoney.ap,
                    moneyTypeCode: moneySumObj.selMoney.moneyTypeCode,
                    projectCode: moneySumObj.selMoney.projectCode,
                    cateCode: moneySumObj.selMoney.cateCode
                }
            });
        })
    })
    const moneySumObj = new Object({
        selMoney: {},
        refreshTable: function () {
            $('#moneySum_table').bootstrapTable("refresh");
        },
        resetTable: function () {
            $('#moneySum_form')[0].reset();
            $('#moneySum_table').bootstrapTable("refresh");
        },
        expertTable: function () {
            $('#moneySum_table').tableExport({
                type: 'excel',
                fileName: '经费导出'
            });
        },
        initTable: function () {
            $('#moneySum_table').bootstrapTable({
                toolbar: "moneySum_table_toolbar",
                //showExport: true,
                exportDataType: "",
                exportTypes: ['excel'],
                exportOptions: {
                    fileName: function () {
                        return '预算导出'
                    }
                },
                url: '/money/his/moneyinfosum/sumList',
                formatNoMatches: function () {  //没有匹配的结果
                    return '暂无数据';
                },
                method: "post",
                queryParams: function (param) {
                    let myParam = {
                        ap: $('#moneySum_ap').val(),
                        moneyTypeCode: $('#moneySum_moneyTypeCode').val(),
                        projectName: $('#moneySum_projectName').val(),
                        cateName: $('#moneySum_cateName').val()
                    }
                    return myParam;
                },
                columns: [{
                    title: '#',
                    align: 'center',
                    width: 50,
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    title: '年度',
                    field: 'ap',
                }, {
                    title: '经费类型',
                    field: 'moneyTypeName'
                }, {
                    title: '预算项目',
                    field: 'projectName'
                }, {
                    title: '经济分类',
                    field: 'cateName'
                }, {
                    title: '总金额',
                    field: 'totalMoney',
                    formatter: function (value, row, index) {
                        let num = parseFloat(value).toFixed(2);
                        num = parseFloat(num)
                        num = num.toLocaleString();
                        return `¥ ${num}`;
                    }
                }, {
                    title: '暂停金额',
                    field: 'stopMoney',
                    formatter: function (value, row, index) {
                        let num = parseFloat(value).toFixed(2);
                        num = parseFloat(num)
                        num = num.toLocaleString();
                        return `¥ ${num}`;
                    }
                }, {
                    title: '冻结金额',
                    field: 'freezsMoney',
                    formatter: function (value, row, index) {
                        if (!value) {
                            return "";
                        }
                        let num = parseFloat(value).toFixed(2);
                        num = parseFloat(num)
                        num = num.toLocaleString();
                        return `<a class="frzzse text-success" href="javascript:">¥ ${num}</a>`;
                    },
                    events: moneySum_operateEvents
                }, {
                    title: '支付金额',
                    field: 'useMoney',
                    formatter: function (value, row, index) {
                        if (!value) {
                            return "";
                        }
                        let num = parseFloat(value).toFixed(2);
                        num = parseFloat(num)
                        num = num.toLocaleString();
                        return `¥ ${num}`;
                    }
                }, {
                    title: '可用金额',
                    field: 'availableMoney',
                    formatter: function (value, row, index) {
                        let num = parseFloat(value).toFixed(2);
                        num = parseFloat(num)
                        num = num.toLocaleString();
                        return `¥ ${num}`;
                    }
                }],
                responseHandler: function (res) {
                    return res.data;
                },
                onDblClickRow: function (row, $element, field) {

                }
            });
        },
        initFreezsTable: function () {
            $('#moneySum_freezs_table').bootstrapTable({
                showExport: true,
                exportDataType: "",
                exportTypes: ['excel'],
                exportOptions: {
                    fileName: function () {
                        return '经费冻结导出'
                    }
                },
                formatNoMatches: function () {  //没有匹配的结果
                    return '暂无数据';
                },
                method: "post",
                columns: [{
                    title: '#',
                    align: 'center',
                    width: 50,
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    title: '经费类型',
                    field: 'moneyTypeName'
                }, {
                    title: '预算项目',
                    field: 'projectName'
                }, {
                    title: '经济分类',
                    field: 'cateName'
                }, {
                    title: '冻结金额',
                    field: 'money',
                    formatter: function (value, row, index) {
                        let num = parseFloat(value).toFixed(2);
                        num = parseFloat(num)
                        num = num.toLocaleString();
                        return `¥ ${num}`;
                    }
                }, {
                    title: '单据号',
                    field: 'processCode'
                }],
                responseHandler: function (res) {
                    return res.data;
                }
            });
        }
    })

    moneySum_operateEvents = {
        'click .frzzse': function (e, value, row, index) {
            moneySumObj.selMoney = row;
            $('#moneySum_freezsModal').modal('show')
        }
    };
</script>
</body>
</html>